$(function(){
	$('#index_menu').find('li').mouseover(function(){
		$(this).find('.title').css('color','#00C1DE');
		turnup($(this).find('.right'),2100);
	});

	$('#index_menu').find('li').mouseleave(function(){
		$(this).find('.title').css('color','#373d41');
		turndown($(this).find('.right'),2100);
	});
	var trigger;
	$(".card_area ul .card_item").hover(
		function(){
			var $this =$(this);
			trigger = setTimeout(function(){
					$(".card_area ul .card_item").removeClass("active")
					$this.addClass("active")
				},150)
		},
		function(){
        	clearTimeout(trigger);
		}
	)
	function turndown(el,x){
		for (var i = 0; i < 5; i++) {
			(function(i) {
				setTimeout(function() {
					i = (i-4)*x;
					$(el).css("background-position","0 "+i+"px");
				}, i * 100);
			})(i);
		}
	}
	function turnup(el,x){
		for (var i = 0; i < 5; i++) {
			(function(i) {
				setTimeout(function() {
					i = -i*x;
					$(el).css("background-position","0 "+i+"px");
				}, i * 100);
			})(i);
		}
	}
	var $wrapper_width = parseInt($('.plan').css('width'));
	var $li_num = $('.plan ul li').length;
	var $li_width = $wrapper_width/5;
	var $li_height = $li_width*1.46;
	$('.plan').css('height',$li_height+'px');
	$('.plan ul li').css('width',$li_width+'px');
	$('.plan ul li').css('height',$li_height+'px');
	$('.plan ul').css('width',$li_num*$li_width+'px');
	$('.plan ul').css('height',$li_height+'px');
	$(window).resize(function(){
		var $wrapper_width = parseInt($('.plan').css('width'));
		var $li_width = $wrapper_width/5;
		var $li_height = $li_width*1.46;
		$('.plan').css('height',$li_height+'px');
		$('.plan ul').css('width',$li_num*$li_width+'px');
		$('.plan ul').css('height',$li_height+'px');
		$('.plan ul li').css('width',$li_width+'px');
		$('.plan ul li').css('height',$li_height+'px');
		$('.plan .img_cover').css('width',$li_width*.25);
		$('.plan .img_cover').css('height',$li_width*.25)
	})
	$('.server .product_cell .img').hover(function(){
		turndown($(this).find('.img_cover'),375),function(){
			turnup($(this).find('.img_cover'),375)
		}
	});

	/***轮播图***/
	function turnRight(el){
		var $li_width = parseInt($('.plan ul li').css('width'));
		var $left = parseInt($('.plan ul').css('left'));
		var $leftTo = $li_width;
		if (Math.abs($left)>=($li_num-5)*$li_width) {
			$leftTo = 0;
		}else{
			$leftTo = $left-$li_width;
		}
		$(el).css('left',$leftTo+'px');
	}
	function turnLeft(el){
		var $li_width = parseInt($('.plan ul li').css('width'));
		var $left = parseInt($('.plan ul').css('left'));
		var $leftTo = $li_width;
		console.log($left)
		console.log($leftTo)
		if (Math.abs($left)<=Math.abs($li_width)) {
			$leftTo = -($li_num-5)*$li_width;
		}else{
			$leftTo = $left+$li_width;
		}
		$(el).css('left',$leftTo+'px');
	}
	$('.plan button.right').click(function(){
		turnRight($('.plan ul'));
	})
	$('.plan button.left').click(function(){
		turnLeft($('.plan ul'));
	})
})
